<template>
  <div class="app-container">
    <Sidebar />
    <div class="main-content-wrapper">
      <Header />
      <MainContent />
    </div>
  </div>
</template>

<script>
import Sidebar from '../components/layout/Sidebar.vue'
import Header from '../components/layout/Header.vue'
import MainContent from '../components/layout/MainContent.vue'

export default {
  name: 'MainLayout',
  components: {
    Sidebar,
    Header,
    MainContent
  }
}
</script>

<style scoped>
.app-container {
  display: flex;
  min-height: 100vh;
}
.main-content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
}
</style> 